<template>
	<pro-table ref="protable" :loadDataUrl="loadDataUrl" rowKey="id" :columns="columns" :isRowSelection="true" @selectedRowChange="onSelectChange">
	<!-- 这些是 table中插槽  end -->
	<a-space slot="operation" slot-scope="{ text, record, index }">
		<a-button type="primary" @click="editUser(record)">编辑</a-button>
	</a-space>
	<template slot="footer">
		<a-button class="ant-btn-success" @click="editUser()">新增</a-button>
	</template>
		<!-- 新增或者编辑组件 -->
		<add-user-modal ref="addAccountModal" @ok="handlerRefresh(0)"></add-user-modal>
	</pro-table>
</template>

<script>
import { rowSelection } from '@/mixins'; //列表页面的一些公用方法
import addUserModal from './module/addUserModal'; //新增或编辑组件
import { api } from '@/api/index.js';
const columns = [
	{
		title: '账号',
		dataIndex: 'account',
		key: 'account',
		ellipsis: true,
		/* 筛选列表 */
		searchInfo: {
			type: 'String', //筛选类型 参考filterbar readme
			value: 'account' //查询字段，如果不配置，怎取key
		}
	},
	{
		title: '昵称',
		dataIndex: 'name',
		key: 'name',
		ellipsis: true,
		/* 筛选列表 */
		searchInfo: {
			type: 'String', //筛选类型 参考filterbar readme
			value: 'name' //查询字段，如果不配置，怎取key
		}
	},

	{
		title: 'openId',
		dataIndex: 'openId',
		key: 'openId'
	},
	{
		title: '操作',
		key: 'operate',
		dataIndex: 'operate',
		scopedSlots: { customRender: 'operation' },
		align: 'center',
		width: 100
	}
];
export default {
	name: 'schoollist',
	mixins: [rowSelection],
	data() {
		return {
			columns: columns,
			filter: {},
			loadDataUrl: api.getUserList //查询列表接口，请在 api/index.js中配置
		};
	},
	components: { addUserModal },
	filters: {},
	methods: {
		/* 刷新列表当前页 */
		handlerRefresh(type) {
			this.$refs.protable.handlerRefresh(type);
		},
		/* 确认是否删除 */
		showDeleteConfirm(keys) {
			let _this = this;
			let title = 'Are you sure you want to delete?';
			this.$confirm({
				title: title,
				content: 'Information cannot be restored after deletion',
				okText: 'OK',
				cancelText: 'Close',
				class: 'confirmbox',
				okType: 'danger',
				onOk() {
					_this.remove(keys);
				},
				onCancel() {}
			});
		},
		/*删除*/
		remove(delId) {
			this.$postAction(api.batchDelUser, {
				userIdList: delId
			}).then(res => {
				if (res.result) {
					this.$message.success('succeed to delete');
					this.handlerRefresh();
				}
			});
		},
		/* 编辑 /添加*/
		editUser(record) {
			this.$refs.addAccountModal.add(record);
		},
		/* 启停用 */
		disableUser(uuid) {
			this.$postAction(api.disableUser + uuid).then(res => {
				if (res.result) {
					this.$message.success('Action successed');
					this.handlerRefresh();
				}
			});
		}
	}
};
</script>

<style></style>
